<template>
	<view>
		<view class="wformwidth">
			<u-form class="uformwidth" :model="form" ref="uForm">
				<u-form-item label="姓名" label-width="100rpx" prop="name">
					<u-input placeholder="请输入姓名" type="text" height="30" v-model="form.name" />
				</u-form-item>
				<u-form-item label="手机号" label-width="150rpx" prop="phone">
					<u-input placeholder="请输入手机号" type="text" height="30" v-model="form.phone" />
				</u-form-item>
				<u-form-item label="收货地址" label-width="180rpx" prop="address">
					<u-input placeholder="请输入收货地址" type="text" height="30" v-model="form.adress" disabled />
				</u-form-item>
				<u-form-item label="详细地址" label-width="180rpx" prop="detail_address">
					<u-input placeholder="请输入详细地址" type="text" height="30" v-model="form.detail_address" />
				</u-form-item>
			</u-form>
		</view>
		<button class="btn" @click="submit()">保存</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				sec: 1,
				form: {
					uuid: '', //
					name: '', //联系人
					phone: '', //电话
					adress: '贵州省黔南布依族苗族自治州长顺县', //收货地址地区
					detail_address: '', //详细地址
				},
				rules: { //验证规则
					name: [{
							required: true,
							message: '请填写姓名',
							trigger: ['change', 'blur']
						},
						{
							pattern: /^[\u4e00-\u9fa5]+$/,
							message: '错误的字符',
							trigger: ['blur']
						}
					],
					phone: [{
						required: true,
						message: '请填写联系方式',
						trigger: ['change', 'blur'],
					}, {
						validator: (rule, value, callback) => {
							return this.$u.test.mobile(value);
						},
						message: "手机号格式不正确",
						trigger: ['blur']
					}],
					// address: [{
					// 	required: true,
					// 	message: '请填写收货地址',
					// 	trigger: ['change', 'blur']
					// }, {
					// 	pattern: /^[a-zA-Z0-9_/.\u4e00-\u9fa5]+$/,
					// 	message: '错误的字符',
					// 	trigger: ['blur']
					// }],
					detail_address: [{
						required: true,
						message: '请填写详细地址',
						trigger: ['change', 'blur']
					}, {
						pattern: /^[a-zA-Z0-9_/.\u4e00-\u9fa5]+$/,
						message: '错误的字符',
						trigger: ['blur']
					}],
				},
			}
		},
		methods: {
			submit() {
				const userdata = {
					'userDetailedAddress': this.form.adress+this.form.detail_address,
					'userRealName': this.form.name,
					'userTel': this.form.phone,
					'uuid': this.form.uuid
				}
				this.$refs.uForm.validate(valid => {
					if (valid) {
						// console.log('验证成功');
						uni.showToast({
							title: '加载中',
							icon: 'loading',
							duration: 3000
						});
						setTimeout(() => {
							this.$myRequest({
								url: '/receivingAddress/addAddress',
								method: 'POST',
								data: userdata
							}).then((res) => {
								if (res.data.code == 200) {
									uni.showToast({
										title: '保存成功',
										icon: 'success',
										duration: 3000
									});
									this.changeuserinfo(userdata);
									setTimeout(res => {
										this.goreturn();
									}, 1000)
						
								} else {
									uni.showToast({
										title: '保存失败',
										icon: 'error'
									})
								}
							});
						}, 1500);

					}
				});
			},
			changeuserinfo(userdata){
				getApp().globalData.userinfo.userRealName=userdata.userRealName;
				getApp().globalData.userinfo.userTel=userdata.userTel;
				getApp().globalData.userinfo.userDetailedAddress=userdata.userDetailedAddress;
			},
			goreturn() {
				// console.log('test');
				uni.navigateBack({
					delta: 1,
					animationType:'slide-out-left'
				})
			},
			getuserinfo() {
				const info = getApp().globalData.userinfo;
				console.log(info);
				if (info) {
					// this.form.open_id = info.openid;
					this.form.name = info.userRealName;
					this.form.phone = info.userTel;
					this.form.uuid = info.uuid
					let str = info.userDetailedAddress;
					let ig = this.form.adress;
					// console.log(ig);
					let re = new RegExp(ig, "ig"); //生成正则表达式
					// 利用正则表达式过滤出详细地址
					this.form.detail_address = str.replace(re, "");
					console.log(this.form);

				} else {
					uni.showToast({
						title: '个人信息获取失败',
						icon: 'error'
					})
				}
			},
			//页面跳转
			goto() {
				let turl = '/operatesuccess' + '?delta=3&' + 'successtext=保存成功';
				console.log(turl);
				uni.navigateTo({
					url: turl,
					animationType: 'slide-in-right',
					animationDuration: 1000

				})
			},
			setvalue(i) {
				this.sec = i;
			},
		},
		onLoad() {
			this.getuserinfo();
		},
		onReady() { //生命周期
			this.$refs.uForm.setRules(this.rules);
		}
	}
</script>

<style>
	page {
		background-color: #FFFFFF;
	}
	.wformwidth{
		width: 94vw;
		margin-left: 3vw;
	}
/* 	.uformwidth {
		padding-left: 40rpx;
	}
 */
	.btn {
		width: 90vw;
		height: 80rpx;
		background-color: rgba(255, 87, 51, 1);
		margin-top: 100rpx;
		color: #FFFFFF;
		font-size: 36rpx;
		line-height: 80rpx;
		border-radius: 40rpx;
	}
</style>
